<!DOCTYPE html>
<html>
<head>
	<title>今日月读</title>
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<link rel="stylesheet" type="text/css" href="./statics/style/public.css">
	<style type="text/css">
		.todayTask {
			width: 100%;
			height: auto;
			background-color: #fff;
			font-size: 12px;
			display: flex;
			flex-direction: column;
			margin: 30px auto;
			border-radius: 4px;
			justify-content: space-between;
		}
		.todayTask img:first-child {
			height: 168px;
		}
		.date {
			font-size: 17px;
			margin-top: 20px;
			color: #42323d;
			line-height: 17px;
			margin-bottom: 15px;
			align-self: center;
		}
		.tasks {
			width: 228px;
			align-self: center;
		}
		.taskTitle {
			font-size: 15px;
			line-height: 15px;
			margin-bottom: 17px;
			color: #42323e;
		}
		.tasks p {
			line-height: 14px;
			font-size: 12px;
			color: rgba(66,50,62,0.8);
		}
		.taskBtn {
			border: none;
			outline: none;
			width: 190px;
			height: 48px;
			background: url("./statics/img/myTask/btn.png") no-repeat center;
			font-size: 17px;
			color: #42323d;
			align-self: center;
		}
		
	</style>
</head>
<body>
	<div class="mainContent">
		<div class="todayTask">
			<img src="./statics/img/myTask/top.png">
			<span class="date">2018-05-08</span>
			<div class="tasks">
				<span class="taskTitle">书中的世界</span>
				<p>我是课程描述课程描述课程描述</p>
			</div>
			<button class="taskBtn">前往学习</button>
			<img src="./statics/img/myTask/bottom.png">
		</div>
	</div>
</body>
</html>